<!DOCTYPE html>
<html>
  <!--
<body>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>
  //       axios.get('http://yapi.smart-xwork.cn/mock/78830/Online/userlist')
  // .then(function (response) {
  //   let str = "<ul>";
  //   for(let item of response.data.data){
  //     str += `<li>${item.id}</li>`;      
  //   }
  //   str+="</ul>";
  //   $("body").append(str);
  // })
  // .catch(function (error) {
  //   console.log(error);
  // });


  


    </script>
</body> -->

<style>
 p#back-to-top{
            position:fixed;
            display:none;
            bottom:100px;
            right:80px;
        }
</style>
<body>
  <p id="back-to-top"><a href="#top">返回顶部</a></p>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
 $(function(){
        //当滚动条的位置处于距顶部100像素以下时，跳转链接出现，否则消失
        $(function () {
            $(window).scroll(function(){
                if ($(window).scrollTop()>100){
                    $("#back-to-top").fadeIn(1500);
                }
                else
                {
                    $("#back-to-top").fadeOut(1500);
                }
            });
 
            //当点击跳转链接后，回到页面顶部位置
            $("#back-to-top").click(function(){
                if ($('html').scrollTop()) {
                    $('html').animate({ scrollTop: 0 }, 100);//动画效果
                    return false;
                }
                $('body').animate({ scrollTop: 0 }, 100);
                return false;
            });
        });
    });
  　</script>
  </body>
</html>   